<html>
<head>
	<script src="plugin/jquery-ui/js/jquery-1.5.1.min.js" type="text/javascript" ></script>
</head>
<body >
	<div id="view" style="height:300px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:0px; top:0px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:70px; top:0px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:140px; top:0px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:35px; top:15px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:105px; top:15px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:175px; top:15px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:0px; top:30px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:70px; top:30px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:140px; top:30px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:35px; top:45px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:105px; top:45px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:175px; top:45px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:0px; top:60px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:70px; top:60px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:140px; top:60px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:35px; top:75px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:105px; top:75px;">
		<img src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:175px; top:75px;">		
		
	</div>
	<div id="alt-view" style="position:absolute; top:150px; height:100px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:0px; top:0px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_s.png" style="position:absolute; left:70px; top:0px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:140px; top:0px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_s.png" style="position:absolute; left:35px; top:15px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:105px; top:15px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_s.png" style="position:absolute; left:175px; top:15px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:0px; top:30px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_s.png" style="position:absolute; left:70px; top:30px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:140px; top:30px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_s.png" style="position:absolute; left:35px; top:45px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:105px; top:45px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_s.png" style="position:absolute; left:175px; top:45px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:0px; top:60px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_s.png" style="position:absolute; left:70px; top:60px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:140px; top:60px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_s.png" style="position:absolute; left:35px; top:75px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_n.png" style="position:absolute; left:105px; top:75px;">
		<img  src="c:/repos/mud-assets/target/blender/tiles/hex_wood_1_s.png" style="position:absolute; left:175px; top:75px;">
	</div>
	
	
	<div>
		<input type="text" id="path" value="c:/repos/mud-assets/target/blender/tiles/" style="width:300px;"><br/>
		<input type="file" id="f1">
	</div>
	
	<script type="text/javascript">
		$("#f1").change(function(){
			$('#view > img, img.a1').each(function(){ 
				var f1 = $('#f1').val()
				var path = $('#path').val()
				f1 = f1.substring( f1.lastIndexOf('\\') )
				$(this).attr('src', path+f1) 
			})
			$('#alt-view > img').each(function(){ 
				var f1 = $('#f1').val()
				var path = $('#path').val()
				f1 = f1.substring( f1.lastIndexOf('\\') )
				f1 = f1.substring( 0, f1.length - 5)
				var i = Math.floor(Math.random()*6)
				var ext;
				if( i == 0 ){ ext = 'n' }
				if( i == 1 ){ ext = 's' }
				if( i == 2 ){ ext = 'ne' }
				if( i == 3 ){ ext = 'nw' }
				if( i == 4 ){ ext = 'se' }
				if( i == 5 ){ ext = 'sw' }
				
				$(this).attr('src', path+f1 + ext + '.png') 
			})
		})
	</script>
</body>
</html>